class GoodList {
  constructor() {
    this.init();

  }
  // async是对promise的一次更改
  async init() {

    this.goods_list = document.querySelector(".item-bg");
    // this.good_box= document.querySelector(".goods")
    this.data = null;
    this.current = 0;
    this.num = 0;
    //   this.pagesize = 30;
    this.car_data = this.getCartData();

    this.bindEvent();
    try {

      let res = await this.loadData();
      // console.log(res);
      this.data = res;
      //  console.log(this.data);
      this.initPagination();
      // this.render(this.data);
      




    } catch (e) {
      // location.href = "login.html"
    }
  }
  // console.log(3);
  bindEvent() {
    on(this.goods_list, "click", "img", (e) => {
      this.go(e.origin.getAttribute("data-id"));
      console.log(e.origin.getAttribute("data-id"));
    });
    on(this.goods_list, "click", ".car", (e) => {
      let id = e.origin.getAttribute("data-id");
      // console.log(id);
      let res = this.search(id);
      // console.log(2);
      this.addCart(id, res);
      location.href = "./shopping_cart.html";

      alert("添加成功");
    });

    $(".more-btn").on("click", () => {
      this.descending();
    })
    $(".expend-btn").on("click", () => {
      // console.log(data);
      this.ascending();
    })
  }
  // 排序


  descending() {

    // console.log(this.data.length);
    for (var i = 0; i < this.data.length; i++) {
      for (var j = 0; j < this.data.length - 1 - i; j++) {
        // console.log(num1);

        if (parseInt(this.data[j].price.replace("<i>¥</i>", "").replace("<i>", "").replace("</i>", "")) > parseInt(this.data[j + 1].price.replace("<i>¥</i>", "").replace("<i>", "").replace("</i>", ""))) {

          var tmp = this.data[j];
          this.data[j] = this.data[j + 1];
          this.data[j + 1] = tmp;
        }
      }
    }
   console.log(this.data);
    // console.log(this.data);
    // this.render(this.data);
    this.initPagination();
  }

  // 降序
  ascending(){
    for (var i = 0; i < this.data.length; i++) {
      for (var j = 0; j < this.data.length - 1 - i; j++) {
        // console.log(num1);

        if (parseInt(this.data[j].price.replace("<i>¥</i>", "").replace("<i>", "").replace("</i>", "")) < parseInt(this.data[j + 1].price.replace("<i>¥</i>", "").replace("<i>", "").replace("</i>", ""))) {

          var tmp = this.data[j];
          this.data[j] = this.data[j + 1];
          this.data[j + 1] = tmp;
        }
      }
    }
   console.log(this.data);
    this.initPagination();
  }

 







  loadData() {
    //   let source = axios.CancelToken.source();
    let options = {
      url: "../static/data/hufup.json",
      //   cancelToken: source.token,
      //   source : source,
    };
    return $.ajax(options);
  }
  render(data) {
    var html = "";
    for (var i = this.current * this.num; i < this.current * this.num + this.num; i++) {
      // console.log(1);
      html += `<div class="goods" data-id="${data[i].id}">
                                    <img data-id="${data[i].id}" src="${data[i].src}" alt="" class="lazy-load" data-src="${data[i].src}">
                                    <p class="title">${data[i].title}</p>
                                    <p class="price-box">
                                        <span class="price">
                                            ${data[i].price}
                                        </span>
                                    </p>
                                    <div class="car" data-id="${data[i].id}">
                                    
                                    加入购物车
                                    </div>
                                    </div>`
      new LazyLoad("img.lazy-load");
      // this.pagination()

      $(".item-bg").html(html);
    }
  }

  go(id) {
    location.href = "goodDetails.html#id=" + id;

  }
  search(id) {
    // console.log(1);
    let res = null;

    this.data.some(item => {

      if (id === item.id) {
        res = item;
        return true
      }
    })
    console.log(res);
    return res;
  }

  getCartData() {
    try {
      let data = JSON.parse(localStorage.getItem("car"))
      if (data === null) {
        return {}
      }
      return data;
    } catch (e) {
      return {};
    }
  }
  addCart(id, data) {
    // 判断当前的id是否存在于购物车列表之中
    if (id in this.car_data) {
      // 如果存在就让商品数量自增; 
      this.car_data[id].count++;
    } else {
      // 如果不存在就放入一个初始数据; 
      data.count = 1;
      this.car_data[id] = data;
    }
    this.save();
  }

  save() {
    localStorage.setItem("car", JSON.stringify(this.car_data));
  }

  initPagination() {
    new Pagination(this.data.length, {
      pagination: ".pagination",
      callback: async (index, num) => {


        this.current = index;
        this.num = num;
        // let res = await this.loadData();
        // this.data = res;
        this.render(this.data);
        new LazyLoad(".img img");
      }
    })
  }
}
new GoodList;